// applies only to mobile screens
@media (width <= 768px) {
  .custom-button-active {
    width: 115px;
    margin-bottom: 5px;
  }
}

// applies only to mobile screens
@media (width <= 768px) {
  .custom-button-archived {
    width: 95px;
    margin-bottom: 5px;
  }
}

.sortable-header {
  cursor: pointer;

  i {
    margin-left: 0.3em;
  }

  .fa-stack {
    width: 20%;
  }

  button {
    background: none;
    color: inherit;
    border: none;
    padding: 0;
    text-align: left;
    width: 100%;
    font: inherit;
    cursor: inherit;
  }
}

.course-section {
  margin-top: 2em;
}

.bold-label {
  font-weight: 700 !important;
}

.recycle-bin-body {
  padding: 0;
}

.background-color-medium-gray {
  background-color: #e5e5e6;
}

.text-color-black {
  color: #000;
}

.text-color-gray {
  color: gray;
}

.text-color-lightgray {
  color: lightgray;
}

.text-color-red {
  color: red;
}

.link-disabled {
  cursor: default;
  color: #000;
  pointer-events: none;
}

.recycle-bin-table {
  margin-bottom: 0;
}

.archive-body {
  padding: 0;
}

.archive-table {
  margin-bottom: 0;
}

.margin-top-30px {
  margin-top: 30px;
}

// applies only to non-mobile screens
@media (width >= 768px) {
  .actions-cell button:not(.dropdown-item) {
    margin-left: var(--btn-margin);
  }
}

.dropdown-menu {
  min-width: 0.5rem;
}

.table-responsive {
  overflow: auto;
}

.d-inline-block {
  position: inherit;
}

.link-button {
  border: none;
  text-decoration: underline;
  color: var(--bs-link-color);
  padding: 0;
  background: none;
}

.link-button:hover {
  color: var(--bs-link-hover-color);
}
